<template>
  <div style="margin-top: 20px;">
    <el-form label-width="80px">
      <el-form-item label="实验名称">
        <el-input v-model="expeObject.name" style="width: 50%;"></el-input>
      </el-form-item>
      <el-form-item label="摘要">
        <el-input type="textarea" v-model="expeObject.summary" :autosize="{ minRows: 4, maxRows: 8}" style="width: 50%;"></el-input>
      </el-form-item>
      <el-form-item label="实验目的">
        <el-input type="textarea" v-model="expeObject.purpose" :autosize="{ minRows: 4, maxRows: 8}" style="width: 50%;"></el-input>
      </el-form-item>
      <el-form-item label="实验准备">
        <el-input type="textarea" v-model="expeObject.prepare" :autosize="{ minRows: 4, maxRows: 8}" style="width: 50%;"></el-input>
      </el-form-item>
      <el-form-item label="创建时间">
        <el-date-picker v-model="expeObject.time" type="date" format="yyyy 年 MM 月 dd 日"
          value-format="yyyy-MM-dd" :default-value="expeObject.time" placeholder="选择日期">
      </el-date-picker>
      </el-form-item>
      

      <el-form-item>
        <el-button type="success" @click="onSubmit">创建</el-button>
        <el-button type="warning" @click="cancel">取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  data() {
    return {
      expeObject: {},
    };
  },
  methods: {
    // 点击创建
    onSubmit() {
      this.$http({
        url: "/experiment/add",
        method: "post",
        data: this.expeObject,
      })
        .then((response) => {
          this.$message({
            message: response.data.message,
            type: "success",
          });
          this.$router.push("/expr").catch((err) => err);
        })
        .catch((err) => err);
    },
    // 点击取消
    cancel() {
      this.$router.push("/expr").catch((err) => err);
    }
  },
};
</script>

<style scoped>
.el-input {
  
}
</style>